查看原文
其他

微信文案「颜值」如何系统性提升?(进阶版)

2016-10-25 Coco JZsolv

工作狂必须关注的多媒体、新媒体干货平台

微信号:JZCS0304

职场

学术

新媒体

设计

极客


作为专业的平面/动效设计与新媒体研究团队,

免费教你微信文案颜值进阶的正确玩法。



如果你还没有看过基础版,可以首先点击蓝色字阅读《微信文案「颜值」如何系统性提升?》了解微信文案「颜值」的三种层次和多款编辑器的性能比对。



然而,一个顶尖的图文排版不是仅仅靠若干第三方微信编辑器就可以大功告成的,就很多优质大V级排版来看,编辑的审美能力和设计学功底将直接影响公众号的逼格,营销号另当别论。



一个让人看了觉得精致又赏心悦目的图文排版也不仅仅是页面布局的美观设计,更是整体VI的可识性,易读性。对于非设计师的小编来说,不要求能做到这样吹毛求疵的日式杂志排版水平,但也得有自己的独特风格习惯,这不是强迫症,是对爱你的粉丝读者负责。







色即是空空即是色





你可以选择沉稳大气的黑色,充满理性gay意的蓝色,火热又中立的暗红,你也可以选择最新出炉的2016年度色彩静谧蓝 / 粉晶



不管你选择什么颜色,都要基于你公众号的调性,以及整体风格定位。在选好颜色之后,想要瞬间提升逼格又不会错,请记住以下三大原则


深灰色作为正文字体主色调


一般来说,你的正文文字最好避免使用墨黑色(纯黑),当大面积的黑色字存在的时候会给人以刺眼的感觉(特别是底色还是纯白色),这也就是为何“黑色会压倒一切”,而你所看到的UI设计不论是网页还是app,看上去的黑色大多数都是深灰,深灰色一般更容易阅读也不会累眼。



一种颜色突出重点(强调色)


如果你选择好几种不同的色调来,那么你的配色方案很大程度上是有问题的。你颜色用得越多,你的页面就越来越难以控制。所以最好结合你公众号的VI风格或者本期图文主题只选择一种颜色来作为你想要突出的重点事物(我们称为强调色),黑色不作为强调色,突出的事物比如标题(一级二级)、符号、分割线等等。



对强调色进行同族筛选


推荐配色网站https://color.adobe.com/zh/create/color-wheel



确定强调色之后不断调整饱和度亮度灰度来选择眼睛最舒适的颜色值。








旧版微信编辑后台的标准色卡可以做这一项工作(比较简单粗暴),自微信后台改版以来,很多小编苦恼没有原来的标准色卡,但其实第三方编辑器如 i排版135editor 仍然保留色卡取色,你可以选择在编辑器修改颜色复制,也可以选择借助第三方编辑器查找对应颜色代码值进行修改编辑存储。以135editor为例:


不知道文字颜色RGB时可直接复制进编辑器打开HTML查看



知道RGB值情况下取色区输入RGB值,获取对应#颜色代码复制便于添加新版后台使用


135编辑器也会对最近使用的颜色进行记录,方便直接编辑。




● ● ●




距离产生美




比如“深夜发媸”这类情感向账号标志性排版就是大面积空白,艺术角度上叫做留白(White Space),但是你知道为什么留白吗?除了有强烈的视觉冲击力之外还有什么奥秘和理论依据吗?再谈及这个问题之前我想跟大家探讨一个更加实用的排版技巧。



以前讲课的时候曾提到「 有种逼格叫做两端缩进 」&「 有种文艺叫做字字间距 」,从设计学角度而言,它们也是留白的一种简单形式。比如下面我们讲解排版设计段落本身






·排版设计大法·



欧洲各大院校设计师练习排版最有用的办法就是放弃电脑,然后找到一堆透明硫酸纸,将同种字体同种字号同种粗细的句子或者段落印在硫酸纸上,像下图,然后不断地进行排列组合。该方法可以不断地提高我们对文字与行与段落的认识以及敏感度。





·普通的设计师·





·牛逼的设计师·



分享来自@孙青椒




那么两端缩进和字间距的效果如何完成呢?如果我们借助第三方编辑器,两端缩进可使用秀米的卡片功能,将边框和背景颜色皆调为透明即可。





如果要进行CSS的书写,则需要修改代码的margin值,调整像素为10px-15px(越大缩进越多)




字字间距则记住这段代码


<section style="letter-spacing:10px">

这里填写需要设置字字间距的文字内容

</section>


打开第三方编辑器如i排版,点击html后将代码复制进行修改即可。




● ● ●



大道至简 极简至真




「少即是多」的极简主义理念,想必大家都耳熟能详,很多关于简约主义的说法是减少减少再减少。实际上,极简主义是一种很极端的的概念,却又能够让你不断沉思其中,而且对于不同的人和事物有不同的极简主义。比如对于徐老师而言,极简主义这种东西似乎是直男设计师的专属?但是由于美入人心又爱之不已。



Google的标志是极简主义的代表,既有趣又让人印象深刻





Google产品的Logo遵循统一的样式(不包括Icon):每一个创新产品都配上简约的标志,使人一眼就认出是Google家出来的。比如说Squared的设计, 将手势和Squared经典方括号形状结合起来,就创造了一个完美的新标志,就像prezi里面的 Frame ?!




为了既要符合Google的风格,也不能丢掉自己的个性,让人感到别扭,所以还要继续红蓝黄绿的配色基调,让人可以过目不忘。



而对于我们微信图文排版设计来说,极简主义相较于整体的VI视觉识别尤为重要,比如你会发现JZ经常使用的 ▼ / ● ● ● / ❶❷❸ 等等,简单的小符号给人以清晰的逻辑,与此同时带来满满的逼格感,就像为什么字体小反而更有逼格?也是一样的道理。



再者,文字和图片也应该有效对齐,保持一定缝隙用以产生节奏感。比如利用表格来实现左右分栏,既可以保证屏幕最大化利用(十屏呈现),也基于用户体验来考虑可识性和易读性。




分享一句喜欢的话:



“Perfection is achieved, not when there is nothing more to add, but when there is nothing left to take away.”
臻于完美之时,不是加无可加,而是减无可减。
By Antoine deSaint-Exupéry





(更多牛X排版




献血真的有益身体健康吗?

基于HTML5+CSS3数据可视化排版



微信版大学六级英语听力真题测试

展现微信图文的极限交互功能



我想和你一起生活

充满文艺气息的视觉布局



差不多先生

富文本分栏式极限布局



(如果你想到上面这些程度的话







其他你会感兴趣的内容

回复 新媒体看更多圈内的重要资讯

回复 H 5了解社会化营销利器玩法

回复 广告欣赏一些商业创意广告案

回复 拖延症从源头改变工作的陋习

回复 白噪音看看什么音乐提高效率


设计、培训、运营等合作请致电

TEL:(021)3721 8818




您可能也对以下帖子感兴趣

文章有问题?点此查看未经处理的缓存